<ui:composition xmlns="http://www.w3.org/1999/xhtml" 
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core" 
                xmlns:ui="http://java.sun.com/jsf/facelets" 
                xmlns:p="http://primefaces.org/ui"
                template="/template/plantilla.xhtml">
    <ui:define name="title"><h:outputText value="Sinetcom - Ingreso de Clientes"></h:outputText></ui:define>
    <ui:define name="menu"><ui:include src="/menu/menu.xhtml" /></ui:define>
    <ui:define name="content">
        <f:view contentType="text/html">
            <h:head/>

            <h:body>
                <h:form id="verUsuariosForm">
                    <p:dataTable id="dtUsuarios" rowKey="#{usuarios.id}" var="usuarios" value="#{ingresoUsuarioBean.usuarios}" paginator="true" rows="15"
                                 selection="#{ingresoUsuarioBean.usuarioSeleccionado}" selectionMode="single" paginatorPosition="bottom"
                                 paginatorTemplate="{FirstPageLink} {PreviousPageLink} {CurrentPageReport} {NextPageLink} {LastPageLink}">

                        <f:facet name="header">
                            <h:outputText value="Usuarios"/>
                        </f:facet>
                        
                        <p:ajax event="rowSelect" immediate="true" update="btnEliminar, btnEditar, btnCambiarPassword"></p:ajax>
                        <p:ajax event="rowUnselect" immediate="true" update="btnEliminar, btnEditar, btnCambiarPassword"></p:ajax>
                        
                        <p:column headerText="Cédula" sortBy="#{usuarios.cedulaDeCuidadania}" filterBy="#{usuarios.cedulaDeCuidadania}">
                            <h:outputText value="#{usuarios.cedulaDeCuidadania}"/>
                        </p:column>

                        <p:column headerText="e-Mail" sortBy="#{usuarios.correoElectronico}" filterBy="#{usuarios.correoElectronico}">
                            <h:outputText value="#{usuarios.correoElectronico}"/>
                        </p:column>

                        <p:column headerText="Nombre" sortBy="#{usuarios.nombre}" filterBy="#{usuarios.nombre}">
                            <h:outputText value="#{usuarios.nombre}"/>
                        </p:column>

                        <p:column headerText="Apellido" sortBy="#{usuarios.apellido}" filterBy="#{usuarios.apellido}">
                            <h:outputText value="#{usuarios.apellido}"/>
                        </p:column>             

                        <f:facet name="footer">
                            <p:commandButton id="btnCrear" value="Crear" actionListener="#{ingresoUsuarioBean.definirUsuario}" update=":usuarioForm" onclick="PF('ingreso').show();" >
                                <f:attribute name="esNuevo" value="true"></f:attribute>
                            </p:commandButton>
                            <p:commandButton id="btnEliminar" process="dtUsuarios" value="Eliminar" action="#{ingresoUsuarioBean.eliminarUsuario()}" disabled="#{not(ingresoUsuarioBean.usuarioSeleccionado != null)}" update=":verUsuariosForm:dtUsuarios"/>                       
                            <p:commandButton id="btnEditar" process="dtUsuarios" value="Editar" actionListener="#{ingresoUsuarioBean.definirUsuario}" update=":editarForm" disabled="#{not(ingresoUsuarioBean.usuarioSeleccionado != null)}" onclick="PF('editar').show();" >
                                <f:attribute name="esNuevo" value="false"></f:attribute>
                            </p:commandButton>
                            <p:commandButton id="btnCambiarPassword" value="Cambiar Password" update=":cambioPForm" onclick="PF('actualizarP').show();" disabled="#{not(ingresoUsuarioBean.usuarioSeleccionado != null)}" />
                        </f:facet>
                    </p:dataTable>              
                </h:form>

                <p:dialog header="Insertar Usuario" widgetVar="ingreso" modal="true">
                    <h:form id="usuarioForm">
                        <h:panelGrid columns="2" columnClasses="colum" cellpadding="5">

                            <p:outputLabel for="usuarioGrupo" value="Grupo:"/>
                            <p:selectOneMenu id="usuarioGrupo" value="#{ingresoUsuarioBean.usuarioSeleccionado.grupoid}" converter="#{grupoConverter}" required="true">
                                <f:selectItem itemLabel="Selecione..." itemValue=""/>
                                <f:selectItems value="#{ingresoUsuarioBean.grupos}" var="Grupos" itemLabel="#{Grupos.nombre}" itemValue="#{Grupos.id.toString()}" />
                            </p:selectOneMenu>

                            <p:outputLabel for="usuarioCedula" value="Cédula:"/>
                            <p:inputText id="usuarioCedula" value="#{ingresoUsuarioBean.usuarioSeleccionado.cedulaDeCuidadania}" maxlength="10">
                                <f:ajax event="keyup" execute="@this" render=":growl"></f:ajax>
                                <f:validator binding="#{cedulaCiudadaniaValidator}"></f:validator>
                            </p:inputText>

                            <p:outputLabel for="usuarioMail" value="e-Mail:"/>
                            <p:inputText id="usuarioMail" value="#{ingresoUsuarioBean.usuarioSeleccionado.correoElectronico}" maxlength="45" required="true">
                                <f:ajax event="keyup" execute="@this" render=":growl"></f:ajax>
                                <f:validator binding="#{correoElectronicoValidator}"></f:validator>
                            </p:inputText>

                            <p:outputLabel for="usuarioPassword" value="Password:"/>
                            <p:password id="usuarioPassword" value="#{ingresoUsuarioBean.password}" maxlength="15" match="usuarioPasswordRetype" feedback="true" promptLabel="Password (15 caracteres)" weakLabel="¿De Verdad?" goodLabel="Mejoraste.." strongLabel="Ahora nos entendemos!" required="true"/>

                            <p:outputLabel for="usuarioPassword" value="Re-ingrese Password:"/>
                            <p:password id="usuarioPasswordRetype" value="#{ingresoUsuarioBean.password}" maxlength="15" required="true"/>
                            
                            <p:outputLabel for="usuarioNombre" value="Nombre:"/>
                            <p:inputText id="usuarioNombre" value="#{ingresoUsuarioBean.usuarioSeleccionado.nombre}" maxlength="15" required="true"/>

                            <p:outputLabel for="usuarioApellido" value="Apellido:"/>
                            <p:inputText id="usuarioApellido" value="#{ingresoUsuarioBean.usuarioSeleccionado.apellido}" maxlength="15" required="true"/>

                            <p:outputLabel for="usuarioCelular" value="Celular:"/>
                            <p:inputText id="usuarioCelular" value="#{ingresoUsuarioBean.usuarioSeleccionado.telefonoMovil}" maxlength="15" required="true"/>

                            <p:outputLabel for="usuarioTelefono" value="Teléfono:"/>
                            <p:inputText id="usuarioTelefono" value="#{ingresoUsuarioBean.usuarioSeleccionado.telefonoFijo}" maxlength="15"/>

                            <p:outputLabel for="usuarioTelfOficina" value="Teléfono Oficina:"/>
                            <p:inputText id="usuarioTelfOficina" value="#{ingresoUsuarioBean.usuarioSeleccionado.telefonoEmpresarial}" maxlength="15"/>

                            <p:outputLabel for="usuarioEstado" value="¿Usuario Activo?:"/>
                            <p:selectOneRadio id="usuarioEstado" value="#{ingresoUsuarioBean.usuarioSeleccionado.activo}" required="true">
                                <f:selectItem itemLabel="Si" itemValue="true"/>                    
                                <f:selectItem itemLabel="No" itemValue="false"/>
                            </p:selectOneRadio>

                            <p:commandButton id="btnGrabar" value="Grabar" action="#{ingresoUsuarioBean.guardarUsuario()}" process=":usuarioForm" onstart="statusDialog.show();" oncomplete="if (args &amp;&amp; !args.validationFailed){ PF('ingreso').hide();} statusDialog.hide();" update=":verUsuariosForm:dtUsuarios">
                                <f:ajax execute="@all" render="@form"/>
                            </p:commandButton>
                        </h:panelGrid>
                    </h:form>
                </p:dialog>
                <p:dialog header="Edición de Usuario" widgetVar="editar" modal="true">
                    <h:form id="editarForm">
                        <h:panelGrid columns="2" columnClasses="colum" cellpadding="5">
                            <p:outputLabel for="usuarioGrupoE" value="Grupo:"/>
                            <p:selectOneMenu id="usuarioGrupoE" value="#{ingresoUsuarioBean.usuarioSeleccionado.grupoid}" converter="#{grupoConverter}" required="true">
                                <f:selectItem itemLabel="Selecione..." itemValue=""/>
                                <f:selectItems value="#{ingresoUsuarioBean.grupos}" var="Grupos" itemLabel="#{Grupos.nombre}" itemValue="#{Grupos.id.toString()}" />
                            </p:selectOneMenu>
                            
                            <p:outputLabel for="usuarioCedulaE" value="Cédula:"/>
                            <p:inputText id="usuarioCedulaE" validator="#{ingresoUsuarioBean.validarActualizacionCedulaDeCiudadania}" value="#{ingresoUsuarioBean.usuarioSeleccionado.cedulaDeCuidadania}" maxlength="10">
                            </p:inputText>

                            <p:outputLabel for="usuarioMailE" value="e-Mail:"/>
                            <p:inputText id="usuarioMailE" validator="#{ingresoUsuarioBean.validarActualizacionEmail}" value="#{ingresoUsuarioBean.usuarioSeleccionado.correoElectronico}" maxlength="45" required="true">
                            </p:inputText>
                            
                            <p:outputLabel for="usuarioNombreE" value="Nombre:"/>
                            <p:inputText id="usuarioNombreE" value="#{ingresoUsuarioBean.usuarioSeleccionado.nombre}" maxlength="15" required="true"/>

                            <p:outputLabel for="usuarioApellidoE" value="Apellido:"/>
                            <p:inputText id="usuarioApellidoE" value="#{ingresoUsuarioBean.usuarioSeleccionado.apellido}" maxlength="15" required="true"/>
                            
                            <p:outputLabel for="usuarioCelularE" value="Celular:"/>
                            <p:inputText id="usuarioCelularE" value="#{ingresoUsuarioBean.usuarioSeleccionado.telefonoMovil}" maxlength="15" required="true"/>

                            <p:outputLabel for="usuarioTelefonoE" value="Telefono:"/>
                            <p:inputText id="usuarioTelefonoE" value="#{ingresoUsuarioBean.usuarioSeleccionado.telefonoFijo}" maxlength="15"/>

                            <p:outputLabel for="usuarioTelfOficinaE" value="Telefono Oficina:"/>
                            <p:inputText id="usuarioTelfOficinaE" value="#{ingresoUsuarioBean.usuarioSeleccionado.telefonoEmpresarial}" maxlength="15"/>

                            <p:outputLabel for="usuarioEstadoE" value="Activo?:"/>
                            <p:selectOneRadio id="usuarioEstadoE" value="#{ingresoUsuarioBean.usuarioSeleccionado.activo}" required="true">
                                <f:selectItem itemLabel="Si" itemValue="true"/>                    
                                <f:selectItem itemLabel="No" itemValue="false"/>
                            </p:selectOneRadio>
                            
                            <p:commandButton id="btnGrabar" value="Grabar" action="#{ingresoUsuarioBean.guardarUsuario()}" process=":editarForm" onstart="statusDialog.show();" oncomplete="if (args &amp;&amp; !args.validationFailed){ PF('editar').hide();} statusDialog.hide();" update=":verUsuariosForm:dtUsuarios">
                                <f:ajax execute="@all" render="@form"/>
                            </p:commandButton>
                            
                        </h:panelGrid>
                    </h:form>
                </p:dialog>
                
                <p:dialog header="Cambio de Password" widgetVar="actualizarP" modal="true">
                    <h:form id="cambioPForm">
                        <p:panelGrid columns="2">
                            <p:outputLabel for="pw1" value="Nuevo password:"></p:outputLabel>
                            <p:password id="pw1" required="true" value="#{ingresoUsuarioBean.password}" match="pw2"></p:password>
                            <p:outputLabel for="pw2" value="Re-ingrese nuevo password:"></p:outputLabel>
                            <p:password id="pw2" required="true" value="#{ingresoUsuarioBean.password}"></p:password>
                            <f:facet name="footer">
                                <p:commandButton value="Cambiar" actionListener="#{ingresoUsuarioBean.actualizarPassword}" process=":cambioPForm" onstart="statusDialog.show();" oncomplete="if (args &amp;&amp; !args.validationFailed){ PF('actualizarP').hide();} statusDialog.hide();" update=":verUsuariosForm:dtUsuarios"></p:commandButton>
                            </f:facet>
                        </p:panelGrid>
                    </h:form>
                </p:dialog>
            </h:body>
        </f:view>
    </ui:define>
</ui:composition>

